// sidebar
// $menuText:#bfcbd9;
// $menuActiveText:#409EFF;
// $subMenuActiveText:#f4f4f5; //https://github.com/ElemeFE/element/issues/12951

// $menuBg:#1F2240;
// $menuHover:rgb(25,27,51);

// $subMenuBg:#1F2240;
// $subMenuHover:#001528;

$mainColor: #4b8dff;

$menuText: #000;
$menuActiveText: #409eff;
$subMenuActiveText: #000; //https://github.com/ElemeFE/element/issues/12951

$menuBg: #fff;
$menuHover: #ecf5ff;

$subMenuBg: #fff;
$subMenuHover: #ecf5ff;

$sideBarWidth: 200px;

/* 通用边颜色 */
$commonBorderColor: #a9a9a9;

// the :export directive is the magic sauce for webpack
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
:export {
  menuText: $menuText;
  menuActiveText: $menuActiveText;
  subMenuActiveText: $subMenuActiveText;
  menuBg: $menuBg;
  menuHover: $menuHover;
  subMenuBg: $subMenuBg;
  subMenuHover: $subMenuHover;
  sideBarWidth: $sideBarWidth;
}

/************************
  * 字体大小
************************/
$fontSize12: 12px;
$fontSize14: 14px;
$fontSize16: 16px;
$fontSize18: 18px;
$fontSize24: 24px;
$fontSize36: 36px;
$fontSize46: 46px;
/************************
  * 间距
************************/
$miniSpace: 5px;
$mainSpace: 20px;
$secondarySpace: 16px;
$thirdSpace: 10px;
$fourthSpace: 8px;

/************************
  * form表单相关变量值
  * 业务中只使用这些变量以取代具体的值
************************/
$elFormHeight: 32px;
$elButtonHeight: 32px;
/************************
  * 系统颜色变量值，已 var(--primary-color)的方式使用 *
************************/
$primaryColor: #1d70f5;
$white: #ffffff;
$var-element: '--';
// 页面背景色
$content-bg: #eee;
$colors: (
  primary-color: $primaryColor,
  auxiliary-color-1: #47c1b3,
  auxiliary-color-2: #f57231,
  auxiliary-color-3: #7cb92c,
  success-color: #15ad2c,
  link-color: $primaryColor,
  warn-color: #ff6000,
  error-color: #e70000,
  bk-main-color: #f6f6f6,
  bk-main-color-1: #f9f9f9,
  bk-gray-color: #f6f7f8,

  // 字体颜色
  // 主色调配合使用的文字颜色
  text-color-inverse: $white,
  // 用于页面标题栏标题文字、页面大标题、一级标题、列表主要颜色
  text-color-1: #222222,
  // 用于二级标题文字颜色，正文颜色
  text-color-2: #555555,
  // 用于按钮边框颜色、三级文字、备注文字、灰度色彩图标颜色
  text-color-3: #999999,
  // 用于输入框内预置提示文字、输入框边看颜色
  text-color-4: #cccccc,
  // 用于激活状态文字
  text-color-5: #538ae7,
  
  // 分割线颜色
  line-segmentation-color: #e6e6e6,

  // 北金所颜色变量
  primary-bg-color: #538ae7,
  // 激活块级背景色
  active-block-bg-color: #409eff,
  // 块级背景色
  block-bg-color-1: #e4edfd,
  block-bg-color-2: #f2f3f5,
  block-bg-color: $white,
  block-bg-color-3: #0552cd,

  // button禁用颜色
  disabled-color: #c0c4cc,
  // border颜色
  border-color: #dcdfe6,
  border-color-1: #538ae7,
  border-color-2: #959595,


  
);
$common-style-maps: (
  color: color,
  font-size: font-size,
  font-weight: font-weight,
  text-align: text-align,
  letter-spacing: letter-spacing,
  text-decoration-line: text-decoration-line,
);

:root {
  @each $name, $color in $colors {
    #{$var-element}#{$name}: #{$color};
  }
}
